<template>
	<view>
		<navbar :back="true" title="选择快递" bgColor="#FFFFFF" color="#000"></navbar>
		<view style="background-color: #FFF;padding-bottom: 10rpx;" class="">
			<view class="p-20">
				<u-search placeholder="搜索快递公司" v-model="params.name" shape="round" :showAction="false" @search="search">
				</u-search>
			</view>
		</view>
		<view>
			<view v-for="(item,index) in list" :key="index" class="u-flex u-row-between "
				style="padding: 30rpx;border-top: 1rpx solid #EEEEEE;" @tap="select(item)">
				<text style="font-size: 32rpx;">{{item.label}}</text> <u-icon name="arrow-right" size="32rpx" />
			</view>
		</view>
	</view>
</template>

<script>
	import navbar from '@/components/baseNavbar.vue'
	import {
		getExpressList
	} from '@/api/public.js'
	export default {
		components: {
			navbar
		},
		data() {
			return {
				list: [],
				loading: false,
				loadend: false,
				params: {
					name: '',
					page: 1,
					limit: 20,
				},
			};
		},
		onLoad() {
			this.getList()
		},
		methods: {
			select(item) {
				uni.$emit("express", item)
				uni.navigateBack({
					delta: 1
				})
			},
			search(value) {
				this.params.name = value
				this.resetList()
			},
			resetList() {
				this.list = []
				this.params.page = 1
				this.loadend = false
				this.loading = false
				this.getList()
			},
			getList() {
				if (this.loadend || this.loading)
					return
				this.loading = true
				getExpressList(this.params).then(res => {
					this.total = res.data.total
					this.params.page++
					this.$set(this, 'list', this.list.concat(res.data.list))
					this.loading = false
					if (!res.data.hasNextPage)
						this.loadend = true

				}).catch(err => {
					this.loading = false
					this.loadend = true

				})
			},
		},
		onReachBottom() {
			this.getList()
		}
	}
</script>

<style lang="scss" scoped>

</style>